[#-- freemarker menu demo --]
<style type="text/css">

	/*临时
	body, table, input, textarea, select {
		font-family: 微软雅黑,Verdana,sans-serif,宋体;
	}*/
	
	div.css-menu {
		width:100%;
		float:left;
		font-family: 微软雅黑,Verdana,sans-serif,宋体;
		margin:0;
		padding:0;
	}
	div.m-header, div.m-footer {
		clear:both;
	}

</style>

<script type="text/javascript">
	$(function() {
	    // setup ul.tabs to work as tabs for each div directly under div.panes
	    $("ul.css-tabs").tabs("div.css-panes > div");
	});
</script>
<div id=${menuId} class="css-menu">
	<div class="css-menu m-header"></div>
	<div class="css-menu m-left">
		<ul>
			<li>
				<a href="${menu.url}" title="${menu.description}" >${displayer.getMessage("${menu.title}")}</a>
			</li>
			[#if menu.subComponents != null]
				<ul>
					[#list menu.subComponents as item]
						<li>
							<a href="${item.url}" title="${item.description}" >${displayer.getMessage("${item.title}")}</a>
							${item.breadCrumb}
							${item.menuDepth}
							<ul>
								[#list item.subComponents as i]
									<li>
										<a href="${i.url}" title="${i.description}" >${displayer.getMessage("${i.title}")}</a>
										${i.breadCrumb}
										${i.menuDepth}
									</li>
								[/#list]
							</ul>
						</li>
					[/#list]
				</ul>
			[/#if]
		</ul>
	</div>
	<div class="css-menu m-center"></div>
	<div class="css-menu m-footer"></div>
</div>